<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/add.css"/>
	</head>
	<body>
		<div id="app">
			<div class="header">
				<span>添加用户</span>
			</div>
			<div class="content">
				<table>
					<tr>
						<td class="text-right">姓名</td><td class="content_right"><input id = "input0" class="input" placeholder="请输入姓名"></td>
					</tr>
					<tr>
						<td class="text-right">手机号码</td><td class="content_right"><input class="input" placeholder="请输入手机号码"></td>
					</tr>
					<tr>
						<td class="text-right">密码</td><td class="content_right"><input class="input" placeholder="请输入密码"></td>
					</tr>
					<tr>
						<td></td><td class="content_right"><span id="submit_btn" class="btn btn-info">立即提交</span> <span class="btn">重置</span> </td>
					</tr>
				</table>
			</div>
		</div>
	</body>
	<script src="../../assets/layui.all.js"></script>
	<script src="/qrcode/jquery2.1.4.js"></script>
	<script src="/layer/layer.js"></script>
	<script>
		$(function () {
			$(document).ready(function () {
				$(".input:eq(0)").blur(function () {
					//获取值
					var name = $(".input:eq(0)").val()
					if(name.match(/.{3,16}/)==null){
						layer.tips("用户名至少是3位哦","#input0",{tipsMore:true,tips:2})
					}else{
						layer.tips("用户名可以用",".input:eq(0)",{tipsMore:true,tips:2})
					}

				})
				$(".input:eq(1)").blur(function () {
					//获取值
					var number = $(".input:eq(1)").val()
					if(number.match(/^1[0-9]{10}$/) == null){
						layer.tips("请输入正确的手机号",".input:eq(1)",{tipsMore:true,tips:2})
					}else{
						layer.tips("手机号验证通过",".input:eq(1)",{tipsMore:true,tips:2})
					}
				})
				$(".input:eq(2)").blur(function () {
					//获取值
					var password = $(".input:eq(2)").val()
					if(password.match(/.{4,18}/) == null){
						layer.tips("请输入4-18位的密码",".input:eq(2)",{tipsMore:true,tips:2})
					}else{
						layer.tips("该密码可以用",".input:eq(2)",{tipsMore:true,tips:2})
					}
				})
			})
		})

	</script>
	<style>
		.layui-layer-content {
			color: #ff5722;
		}
	</style>
	<script>
		$(function () {
			$("#submit_btn").click(function () {
				var windowId = layer.load()
				// 获取 输入的值
				var nickName = $(".input:eq(0)").val()
				var phoneNumber = $(".input:eq(1)").val()
				var password = $(".input:eq(2)").val()
				//验证表单数据
				if(nickName.match(/.{3,16}/)==null || phoneNumber.match(/^1[0-9]{10}$/) == null || password.match(/.{4,18}/) == null){
					layer.close(windowId)
					layer.alert("信息填写有误，请重新填写！",{icon:5})
					return;
				}
				var user={
					nickName:nickName,
					phoneNumber:phoneNumber,
					password:password
				}
				$.post("/user/insert.do",user,function (result) {
					layer.close(windowId)
					layer.msg(result.result)
					if(result.status==-1){

					}else{
						//数据成功
						$(".input").val("")
					}

				})

			})
		})
	</script>
</html>
